<template>
	<div class="container">
		<h3>主体审核</h3>
		<el-row style="margin-top: 20px">
		    <el-col :span="7">
		        <el-input placeholder="请输入关键词" v-model="searchName" style="width: 300px">
		            <i slot="prefix" class="el-input__icon el-icon-search"></i>
		            <el-button slot="append" @click="handleSearch">搜索</el-button>
		        </el-input>
		    </el-col>
		   
		</el-row>
		
		<el-table :data="tableData" border ref="multipleTable" header-cell-class-name="table-header" style="margin-top: 20px">
		    <el-table-column prop="abbreviation" sortable label="企业名称"></el-table-column>
		    <el-table-column prop="legalName" sortable label="联系人姓名"></el-table-column>
		    <el-table-column prop="legalPhone" sortable label="联系人电话"></el-table-column>
		    <el-table-column prop="area" sortable label="所在区域"></el-table-column>
		    <el-table-column prop="meetPeople" sortable label="审核状态">
				<template slot-scope="scope">
					<div v-if="scope.row.examined == 0">
						<div class="auditRed"></div>
						<div class="auditText">驳回</div>
					</div>
					<div v-else>
						<div v-if="scope.row.examined == 1">
							<div class="auditGreen"></div>
							<div class="auditText">已审核</div>
						</div>
						<div v-else>
							<div class="auditBlue"></div>
							<div class="auditText">未审核</div>
						</div>
						
					</div>
				</template>
			</el-table-column>
		    <el-table-column label="操作" width="150" align="center">
		        <template slot-scope="scope">
		
		            <el-button  type="text" style="color: #409EFF" @click="handleCheck(scope.$index, scope.row)">查看</el-button>
					<el-button v-if="!scope.row.examined"  type="text" style="color: #409EFF" @click="handleAudit(scope.$index, scope.row)">审核</el-button>
				
		        </template>
		    </el-table-column>
		</el-table>
		<el-pagination
		    layout="total, prev, pager, next, jumper"
		    :page-size="pagesize"
		    :current-page.sync="currentPage"
		    @current-change="handleCurrentChange"
		    :total="total"
		    style="margin-top: 20px"
		></el-pagination>
	</div>
</template>

<script>
	import { CodeToText } from 'element-china-area-data';
	import { goverment_findByList } from "@/request/supervisionCenterApi.js"
	export default{
		data(){
			return{
				searchName:'',
				tableData:[],
				currentPage: 1,
				pagesize: 10,
				total: 0,
			}
		},
		mounted(){
			this.getData()
		},
		methods:{
			// 获取列表数据
			getData(){
				let data = {
					type:"1",
					page:this.currentPage
				}
				goverment_findByList(data).then((res)=>{
					this.tableData = res.rows
					this.total = res.total 
					for (let i = 0; i < this.tableData.length; i++) {
					  var list = this.tableData[i].area.split(",")
					  var arr = ""
					  for (let k = 0; k < list.length; k++) {
					      arr += CodeToText[list[k]] + "/"   
					  }  
					    this.tableData[i].area = arr.substr(0,arr.length-1)
					}
				})
			},
			// 点击切换 页码
			handleCurrentChange(val) {
				this.currentPage = val;
				this.getData();
			},
			// 跳转到审核
			handleAudit(index,row){
				this.$router.push({
					path:'/supervisionCenteraudit/audit/added',
					query:{id:row.id}
				})
			},
			
			// 跳转到查看
			handleCheck(index,row){
				this.$router.push({
					path:'/supervisionCenteraudit/audit/check',
					query:{id:row.id}
				})
			},
			
		
			
			// 搜索
			handleSearch(){
				let searchData = {
					name: this.searchName
				}
				goverment_findByList(searchData).then((res)=>{
					this.tableData = res.rows
					this.total = res.total 
					for (let i = 0; i < this.tableData.length; i++) {
					  var list = this.tableData[i].area.split(",")
					  var arr = ""
					  for (let k = 0; k < list.length; k++) {
					      arr += CodeToText[list[k]] + "/"   
					  }  
					    this.tableData[i].area = arr.substr(0,arr.length-1)
					}
				})
			}
		}
	}
</script>

<style scoped>
	.el-pagination {
	    text-align: center;
	}
	.auditRed{
		width:10px;
		height:10px;
		background:red;
		display:inline-block;
		border-radius:10px;
	}
	.auditText{
		display:inline-block;
		height:14px;
		line-height:14px;
		margin-left:8px;
	}
	.auditBlue{
		width:10px;
		height:10px;
		background:blue;
		display:inline-block;
		border-radius:10px;
	}
	.auditGreen{
		width:10px;
		height:10px;
		background:green;
		display:inline-block;
		border-radius:10px;
	}
</style>
